<template>
  <ele-page flex-table>
    <ComHeader :title="`收货单详情[${info?.order_sn}]`" title="收货单详情" @back="goBack" />

    <ele-card flex-table bordered :header-style="{ padding: '0 16px' }">
      <el-scrollbar>
        <div>
          <el-descriptions title="" :column="4">
            <el-descriptions-item :width="100" label="收货单据">
              <ele-copyable>{{ info.order_sn }}</ele-copyable>
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="入库通知单">
              <ele-copyable>{{ info.oen_sn }}</ele-copyable>
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="关联单号">
              <ele-copyable>{{ info.obj_sn }}</ele-copyable>
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="货主">
              {{ info.supplier_name || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="收货仓库">
              {{ info.warehouse_name || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="入库类型">
              {{ info.type_name || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="通知收货数量">
              {{ info.notice_num || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="待验收数量">
              {{ info.review_num || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="入库数量">
              {{ info.enter_num || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="订单状态">
              <el-tag
                v-if="info.status_name"
                :type="getType(info.status)"
              >
                {{ info.status_name }}
              </el-tag>
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="创建人">
              {{ info.create_user_name || '-' }}
            </el-descriptions-item>
            <el-descriptions-item :width="100" label="创建时间">
              {{ info.create_time ? formatDate(info.create_time) : '-' }}
            </el-descriptions-item>

            <el-descriptions-item :span="2" label="备注">
              {{ info.remark || '-' }}
            </el-descriptions-item>
          </el-descriptions>

          <el-descriptions class="mt-20px" title="商品信息" :column="1" />

          <el-table
            :data="info.product"
            border
            style="width: 100%"
            show-summary
            :summary-method="getSummaries"
            class="form-table"
          >
            <el-table-column type="index" label="序" width="60" align="center" />
            <el-table-column prop="product_name" label="商品名称" align="left" min-width="130" />
            <el-table-column prop="product_code" label="商品编码" align="center" />
            <el-table-column prop="unit" label="主单位" align="center" />
            <el-table-column prop="notice_num" label="通知收货数量" align="center" />
            <el-table-column prop="enter_num" label="已入库数量" align="center" />
            <el-table-column prop="review_num" label="待验收数量" align="center" />

            <el-table-column prop="location" label="库位" :formatter="row => row.location.map(v => v.name).toString()" align="center" />
          </el-table>
        </div>
      </el-scrollbar>
    </ele-card>

    <PageReview v-model="showReview" title="审核验收单" :statusList="reviewList" @done="review" />
  </ele-page>
</template>

<script setup>
import PageReview from '@/components/Common/Review.vue'

defineOptions({ name: 'PurchaseEnterInfo' })

const orderId = ref(0)
const route = useRoute()
const router = useRouter()
const { routeTabKey, removePageTab, setPageTabTitle } = utils.usePageTab()
const { formatDate, getType } = utils
const info = ref({ product: [] })

const showReview = ref(false)

const reviewList = [
  { value: 'YR', label: '收货' },
  { value: 'CD', label: '取消' },
]

onMounted(() => {
  orderId.value = Number(route.params?.id)
  getInfo()
})

function review(data, cb) {
  utils.post('/enterNotice/review', {
    id: info.value.id,
    status: data.status,
    remark: data.remark,
  }).then((res) => {
    cb && cb()
    utils.message(res.msg, res.success)
    if (res.success) {
      showReview.value = false
      getInfo()
    }
  })
}

function goBack() {
  removePageTab({ key: routeTabKey })
  router.push('/enter/list')
}

function getInfo() {
  utils.get('/purchase/enterInfo', { id: orderId.value }).then((res) => {
    info.value = res.data
    setPageTabTitle(`采购收货单[${utils.ellipsisStr(res.data.order_sn, 0, 10)}]`)
  })
}

function getSummaries({ columns, data }) {
  const sums = []
  columns.forEach((column, index) => {
    if (index === 0) {
      sums[index] = '合计'
      return
    }
    const keys = ['notice_num', 'review_num', 'enter_num', 'num']
    if (keys.includes(column.property)) {
      sums[index] = data.reduce((acc, cur) => {
        const num = column.property === 'num' ? utils.totalUnit(cur[column.property]) : cur[column.property]
        return utils.Big(acc).plus(num).valueOf()
      }, 0)
    }
    else {
      sums[index] = ''
    }
  })

  return sums
}
</script>

<style lang="scss" scoped></style>
